<template>
  <div style="margin-top: 30px">
    <van-space direction="vertical" fill size="2rem">
      <van-cell-group inset>
        <van-cell class="personCardContainer" icon="user-circle-o" center="center" size="large" title="李传伟" value="内容"/>
      </van-cell-group>
      <van-grid clickable column-num="3">
        <van-grid-item icon="photo-o" text="挂号记录"/>
        <van-grid-item icon="photo-o" text="门诊缴费"/>
        <van-grid-item icon="photo-o" text="就诊人管理"/>
        <van-grid-item icon="photo-o" text="预约记录"/>
        <van-grid-item icon="photo-o" text="文字"/>
      </van-grid>
    </van-space>
    <UnderTabbar></UnderTabbar>
  </div>
</template>
<script setup>
import UnderTabbar from '../components/UnderTabbar.vue'
</script>
<style scoped>
.personCardContainer {
  height: 100px;
  background-image: url('~@/assets/images/userbackground.png'); /* 图片路径 */
  background-size: cover; /* 填充整个容器 */
  --van-button-primary-background: red;
  --van-cell-icon-size: 50px;
  --van-cell-label-font-size: var(--van-font-size-lg);
}

</style>